<template>
	<view class="wrap">
		<u-button >
			<slot name="listName"></slot>
		</u-button>
		<u-waterfall v-model="flowList" ref="uWaterfall">
			<template v-slot:left="{leftList}">
				<view class="demo-warter" v-for="(item, index) in leftList" :key="index" @tap="gotoPro(item.productId,item.productByStore)">
					<!-- 警告：微信小程序中需要hx2.8.11版本才支持在template中结合其他组件，比如下方的lazy-load组件 -->
					<u-lazy-load threshold="-450" border-radius="10" :image="item.productImgUrl" :index="index"></u-lazy-load>
					<view class="demo-title">
						{{item.productName}}
					</view>
					<view class="demo-price">
						{{item.productPrice}}元
					</view>
					<view class="demo-tag">
						<view class="demo-tag-owner">
							自营
						</view>
						<view class="demo-tag-text">
							放心购
						</view>
					</view>
					<view class="demo-shop">
						{{item.productByStore}}
					</view>
<!-- 					<u-icon name="close-circle-fill" color="#fa3534" size="34" class="u-close" @click="remove(item.id)"></u-icon> -->
				</view>
			</template>
			<template v-slot:right="{rightList}">
				<view class="demo-warter" v-for="(item, index) in rightList" :key="index" @tap="gotoPro(item.productId,item.productByStore)">
					<u-lazy-load threshold="-450" border-radius="10" :image="item.productImgUrl" :index="index"></u-lazy-load>
					<view class="demo-title">
						{{item.productName}}
					</view>
					<view class="demo-price">
						{{item.productPrice}}元
					</view>
					<view class="demo-tag">
						<view class="demo-tag-owner">
							自营
						</view>
						<view class="demo-tag-text">
							放心购
						</view>
					</view>
					<view class="demo-shop">
						{{item.productByStore}}
					</view>
<!-- 					<u-icon name="close-circle-fill" color="#fa3534" size="34" class="u-close" @click="remove(item.id)"></u-icon> -->
				</view>
			</template>
		</u-waterfall>
		<u-loadmore bg-color="rgb(240, 240, 240)" :status="loadStatus" @loadmore="addRandomData"></u-loadmore>
	</view>
</template>

<script>
	import { store } from '@/uni_modules/uni-id-pages/common/store.js'
		import { get, post, removeToken } from '@/utils/api.js';
	export default {
		data() {
			return {
				currentRoute:'', //当前页面路径
				loadStatus: 'loadmore',
				flowList: [],
				list: [
    {
        "productId": 1,
        "productName": "布偶猫",
        "productInfo": "好看的白色布偶猫",
        "productPrice": 1000,
        "productType1": "宠物",
        "productType2": "布偶猫",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "李二狗宠物店",
        "productStorage": 10,
        "productImgUrl": "http://120.27.203.155/petImages/buoumao.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/xionghmao6.mp4"
    },
    {
        "productId": 2,
        "productName": "宠物宝宝",
        "productInfo": "宠物外出便携包",
        "productPrice": 500,
        "productType1": "宠物周边",
        "productType2": "宠物包",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "李二狗宠物店",
        "productStorage": 200,
        "productImgUrl": "http://120.27.203.155/petAccImages/chongwubaobao.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/zhoubian1.mp4"
    },
    {
        "productId": 8,
        "productName": "纯种柴犬",
        "productInfo": "很纯！",
        "productPrice": 2000,
        "productType1": "宠物",
        "productType2": "柴犬",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "李二狗宠物店",
        "productStorage": 5,
        "productImgUrl": "http://120.27.203.155/petImages/chunzhongcaiquan.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/keji0.mp4"
    },
    {
        "productId": 13,
        "productName": "呆萌柴犬",
        "productInfo": "很呆！",
        "productPrice": 1268,
        "productType1": "宠物",
        "productType2": "柴犬",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "王二毛宠物店",
        "productStorage": 7,
        "productImgUrl": "http://120.27.203.155/petImages/daimengcaiquan.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/keji5.mp4"
    },
    {
        "productId": 14,
        "productName": "呆萌柯基",
        "productInfo": "比较萌！",
        "productPrice": 1024,
        "productType1": "宠物",
        "productType2": "柯基",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "王大毛宠物店",
        "productStorage": 9,
        "productImgUrl": "http://120.27.203.155/petImages/daimengkeji.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/keji9.mp4"
    },
    {
        "productId": 15,
        "productName": "德文卷毛猫",
        "productInfo": "看不出卷毛...",
        "productPrice": 648,
        "productType1": "宠物",
        "productType2": "短毛猫",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "王二毛宠物店",
        "productStorage": 10,
        "productImgUrl": "http://120.27.203.155/petImages/dewenjuanmaomao.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/bianmu1.mp4"
    },
    {
        "productId": 16,
        "productName": "狗狗画像",
        "productInfo": "画的挺好看的",
        "productPrice": 49.99,
        "productType1": "宠物周边",
        "productType2": "宠物画像",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "王二毛宠物店",
        "productStorage": 300,
        "productImgUrl": "http://120.27.203.155/petAccImages/gougouhuaxiang.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/zhoubian2.mp4"
    },
    {
        "productId": 17,
        "productName": "狗狗水杯",
        "productInfo": "很能装的水杯",
        "productPrice": 59.99,
        "productType1": "宠物周边",
        "productType2": "水杯",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "王大毛宠物店",
        "productStorage": 400,
        "productImgUrl": "http://120.27.203.155/petAccImages/gougoushuibei.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/zhoubian1.mp4"
    },
    {
        "productId": 18,
        "productName": "狗狗斜挎包",
        "productInfo": "狗狗的时尚单品",
        "productPrice": 99,
        "productType1": "宠物周边",
        "productType2": "宠物包",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "王大毛宠物店",
        "productStorage": 271,
        "productImgUrl": "http://120.27.203.155/petAccImages/gougouxiekuabao.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/zhoubian0.mp4"
    },
    {
        "productId": 19,
        "productName": "乖乖柴犬",
        "productInfo": "蛮乖的",
        "productPrice": 800,
        "productType1": "宠物",
        "productType2": "柴犬",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "嘟嘟宠物店",
        "productStorage": 16,
        "productImgUrl": "http://120.27.203.155/petImages/guaiguaicaiquan.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/bianmu1.mp4"
    },
    {
        "productId": 20,
        "productName": "海盗柯基",
        "productInfo": "One Piece！",
        "productPrice": 10000,
        "productType1": "宠物",
        "productType2": "柯基",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "嘟嘟宠物店",
        "productStorage": 1,
        "productImgUrl": "http://120.27.203.155/petImages/haidaokeji.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/keji5.mp4"
    },
    {
        "productId": 21,
        "productName": "汉堡猫抓板",
        "productInfo": "不是汉堡！！！",
        "productPrice": 80,
        "productType1": "宠物周边",
        "productType2": "猫抓板",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "嘟嘟宠物店",
        "productStorage": 100,
        "productImgUrl": "http://120.27.203.155/petAccImages/hanbaomaozhuaban.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/zhoubian0.mp4"
    },
    {
        "productId": 22,
        "productName": "红点锦蛇",
        "productInfo": "很红",
        "productPrice": 3000,
        "productType1": "宠物",
        "productType2": "锦蛇",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "嘟嘟宠物店",
        "productStorage": 20,
        "productImgUrl": "http://120.27.203.155/petImages/hongdianjinshe.png",
        "productVideoUrl": "http://120.27.203.155/petVideo/she4.mp4"
    },
    {
        "productId": 23,
        "productName": "花花柯基",
        "productInfo": "很好看",
        "productPrice": 2000,
        "productType1": "宠物",
        "productType2": "柯基",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "花花宠物店",
        "productStorage": 10,
        "productImgUrl": "http://120.27.203.155/petImages/huahuakeji.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/keji9.mp4"
    },
    {
        "productId": 24,
        "productName": "虎斑游蛇",
        "productInfo": "蛇中之虎",
        "productPrice": 3000,
        "productType1": "宠物",
        "productType2": "游蛇",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "花花宠物店",
        "productStorage": 4,
        "productImgUrl": "http://120.27.203.155/petImages/hubanyoushe.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/she8.mp4"
    },
    {
        "productId": 25,
        "productName": "加菲猫",
        "productInfo": "有点老",
        "productPrice": 1000,
        "productType1": "宠物",
        "productType2": "短毛猫",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "花花宠物店",
        "productStorage": 9,
        "productImgUrl": "http://120.27.203.155/petImages/jiafeimao.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/xiongmao3.mp4"
    },
    {
        "productId": 26,
        "productName": "鳞斑乌梢蛇",
        "productInfo": "确实有点像鱼鳞",
        "productPrice": 4000,
        "productType1": "宠物",
        "productType2": "游蛇",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "鱼鱼宠物店",
        "productStorage": 10,
        "productImgUrl": "http://120.27.203.155/petImages/linbanwushaoshe.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/she7.mp4"
    },
    {
        "productId": 27,
        "productName": "琳琳熊猫",
        "productInfo": "好可爱！！！",
        "productPrice": 10000000,
        "productType1": "宠物",
        "productType2": "熊猫",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "鱼鱼宠物店",
        "productStorage": 1,
        "productImgUrl": "http://120.27.203.155/petImages/linlinxiongmao.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/xionghmao6.mp4"
    },
    {
        "productId": 28,
        "productName": "猫猫马克杯",
        "productInfo": "装的水很甜",
        "productPrice": 49,
        "productType1": "宠物周边",
        "productType2": "水杯",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "鱼鱼宠物店",
        "productStorage": 300,
        "productImgUrl": "http://120.27.203.155/petAccImages/maomaomakebei.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/zhoubian1.mp4"
    },
    {
        "productId": 29,
        "productName": "猫咪宠物球",
        "productInfo": "很适合小猫",
        "productPrice": 9.9,
        "productType1": "宠物周边",
        "productType2": "宠物球",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "球球宠物店",
        "productStorage": 1000,
        "productImgUrl": "http://120.27.203.155/petAccImages/maomaochongwuqiu.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/zhoubian2.mp4"
    },
    {
        "productId": 30,
        "productName": "毛茸茸柴犬",
        "productInfo": "手感好",
        "productPrice": 1492,
        "productType1": "宠物",
        "productType2": "柴犬",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "球球宠物店",
        "productStorage": 8,
        "productImgUrl": "http://120.27.203.155/petImages/maorongrongcaiquan.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/bianmu9.mp4"
    },
    {
        "productId": 31,
        "productName": "奶牛色边牧幼崽",
        "productInfo": "奶牛色很好看",
        "productPrice": 3000,
        "productType1": "宠物",
        "productType2": "边牧",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "球球宠物店",
        "productStorage": 14,
        "productImgUrl": "http://120.27.203.155/petImages/nainiusebianmuyouzai.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/bianmu2.mp4"
    },
    {
        "productId": 32,
        "productName": "鼠笼",
        "productInfo": "捕鼠神器",
        "productPrice": 100,
        "productType1": "宠物周边",
        "productType2": "捕鼠器",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "鼠鼠宠物店",
        "productStorage": 300,
        "productImgUrl": "http://120.27.203.155/petAccImages/shelong.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/zhoubian1.mp4"
    },
    {
        "productId": 33,
        "productName": "蛇饲料",
        "productInfo": "催肥用的",
        "productPrice": 100,
        "productType1": "宠物周边",
        "productType2": "饲料",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "鼠鼠宠物店",
        "productStorage": 1000,
        "productImgUrl": "http://120.27.203.155/petAccImages/shesiliao.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/zhoubian1.mp4"
    },
    {
        "productId": 34,
        "productName": "蛇玩偶",
        "productInfo": "很逼真",
        "productPrice": 99,
        "productType1": "宠物周边",
        "productType2": "玩偶",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "鼠鼠宠物店",
        "productStorage": 1000,
        "productImgUrl": "http://120.27.203.155/petAccImages/shewanou.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/zhoubian0.mp4"
    },
    {
        "productId": 35,
        "productName": "手绘宠物牌",
        "productInfo": "纯手工！",
        "productPrice": 30,
        "productType1": "宠物周边",
        "productType2": "挂件",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "大狗宠物店",
        "productStorage": 4000,
        "productImgUrl": "http://120.27.203.155/petAccImages/shouhuichongwupai.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/zhoubian2.mp4"
    },
    {
        "productId": 36,
        "productName": "帅气边牧",
        "productInfo": "很帅",
        "productPrice": 1666,
        "productType1": "宠物",
        "productType2": "边牧",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "大狗宠物店",
        "productStorage": 8,
        "productImgUrl": "http://120.27.203.155/petImages/shuaiqibianmu.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/bianmu2.mp4"
    },
    {
        "productId": 37,
        "productName": "泰迪周边",
        "productInfo": "逼真",
        "productPrice": 9.9,
        "productType1": "宠物周边",
        "productType2": "挂件",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "大狗宠物店",
        "productStorage": 1000,
        "productImgUrl": "http://120.27.203.155/petAccImages/taidizhoub.png",
        "productVideoUrl": "http://120.27.203.155/petVideo/zhoubian1.mp4"
    },
    {
        "productId": 38,
        "productName": "英国短毛猫",
        "productInfo": "毛确实不长",
        "productPrice": 1999,
        "productType1": "宠物",
        "productType2": "短毛猫",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "小茂宠物店",
        "productStorage": 13,
        "productImgUrl": "http://120.27.203.155/petImages/UKduanmaomao.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/bianmu2.mp4"
    },
    {
        "productId": 39,
        "productName": "美国短毛猫",
        "productInfo": "毛短",
        "productPrice": 1999,
        "productType1": "宠物",
        "productType2": "短毛猫",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "小茂宠物店",
        "productStorage": 19,
        "productImgUrl": "http://120.27.203.155/petImages/USAdaunmaomao.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/xiongmao3.mp4"
    },
    {
        "productId": 40,
        "productName": "王子柯基",
        "productInfo": "不会打网球",
        "productPrice": 9999,
        "productType1": "宠物",
        "productType2": "柯基",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "小茂宠物店",
        "productStorage": 1,
        "productImgUrl": "http://120.27.203.155/petImages/wangzikeji.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/keji9.mp4"
    },
    {
        "productId": 41,
        "productName": "熊猫杯子",
        "productInfo": "很有创意",
        "productPrice": 9.9,
        "productType1": "宠物周边",
        "productType2": "水杯",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "景天宠物店",
        "productStorage": 1000,
        "productImgUrl": "http://120.27.203.155/petAccImages/xiongmaobeizi.png",
        "productVideoUrl": "http://120.27.203.155/petVideo/zhoubian1.mp4"
    },
    {
        "productId": 42,
        "productName": "熊猫卡片",
        "productInfo": "好玩好看",
        "productPrice": 9.9,
        "productType1": "宠物周边",
        "productType2": "卡片",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "景天宠物店",
        "productStorage": 2000,
        "productImgUrl": "http://120.27.203.155/petAccImages/xiongmaocard.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/zhoubian2.mp4"
    },
    {
        "productId": 43,
        "productName": "熊猫袋子",
        "productInfo": "容量超级大",
        "productPrice": 20,
        "productType1": "宠物周边",
        "productType2": "袋子",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "景天宠物店",
        "productStorage": 600,
        "productImgUrl": "http://120.27.203.155/petAccImages/xiongmaodaizi.png",
        "productVideoUrl": "http://120.27.203.155/petVideo/zhoubian1.mp4"
    },
    {
        "productId": 44,
        "productName": "熊猫公仔",
        "productInfo": "好萌！！！",
        "productPrice": 9.9,
        "productType1": "宠物周边",
        "productType2": "玩偶",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "秀秀宠物店",
        "productStorage": 888,
        "productImgUrl": "http://120.27.203.155/petAccImages/xiongmaogongzai.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/zhoubian0.mp4"
    },
    {
        "productId": 45,
        "productName": "熊猫花花",
        "productInfo": "可爱大熊猫",
        "productPrice": 10000000,
        "productType1": "宠物",
        "productType2": "熊猫",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "秀秀宠物店",
        "productStorage": 1,
        "productImgUrl": "http://120.27.203.155/petImages/xiongmaohuahua.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/xionghmao6.mp4"
    },
    {
        "productId": 46,
        "productName": "西西熊猫",
        "productInfo": "趴着的大熊猫",
        "productPrice": 10000000,
        "productType1": "宠物",
        "productType2": "熊猫",
        "productColor": null,
        "productAge": null,
        "productGender": null,
        "productByStore": "秀秀宠物店",
        "productStorage": 1,
        "productImgUrl": "http://120.27.203.155/petImages/xixixiongmao.jpg",
        "productVideoUrl": "http://120.27.203.155/petVideo/xiongmao3.mp4"
    }
]
			}
		},
		created() {
			this.addRandomData();
			var pages = getCurrentPages() // 获取栈实例
			 let currentRoute = pages[pages.length - 1].route; // 获取当前页面路由
			this.currentRoute = currentRoute
			this.countShopNum()
		},
		mounted() {
			uni.setStorageSync('list', this.list);
		},
		onShow() {
			this.load()
		},
	async onLoad() {
		this.load();
		// 页面加载时立即调用addRandomData来加载数据
		this.addRandomData();
	},
		onReachBottom() {
			this.loadStatus = 'loading';
			// 模拟数据加载
			setTimeout(() => {
				this.addRandomData();
				this.loadStatus = 'loadmore';
			}, 500)
		},
		methods: {
			load(){
				console.log('进入...')
				uni.request({
				url: 'http://10.22.249.231:8181/product/displayProductList',
				method: 'POST',
				success: (res) => {
				if (res.data.code == 300) {
					uni.showToast({
					title: res.data.msg,
					icon: 'none'
					})
				} else {
					this.list = res.data;
					}
					},
				fail: (err) => {
				console.error('请求失败', err);
					}
					});

			},
			gotoPro(productId,productByStore) {
				uni.setStorageSync('productId',productId)
				uni.setStorageSync('productByStore',productByStore)
				uni.navigateTo({
					url:'/pages/proDetail/proDetail'
				})
			},
			countShopNum()
			{
				post('/cart/getCartCountByUserName',
				 {
					 cartUser:store.userInfo.username
				 }
				 , {
				  needToken: true, 	
					success: (res) => {
					if (res.statusCode === 200) {
					   uni.setStorageSync('shopNum',res.data.data)			  
						}
					}
				}); 
			},
			addRandomData() {
				for(let i = 0; i < 10; i++) {
					let index = this.$u.random(0, this.list.length - 1);
					// 先转成字符串再转成对象，避免数组对象引用导致数据混乱
					let item = JSON.parse(JSON.stringify(this.list[index]))
					item.prodcutId = this.$u.guid();
					this.flowList.push(item);
				}
			},	
		},
	}
</script>

<style>
	/* page不能写带scope的style标签中，否则无效 */
	page {
		background-color: rgb(240, 240, 240);
	}
</style>

<style lang="scss" scoped>
	.demo-warter {
		border-radius: 8px;
		margin: 5px;
		background-color: #ffffff;
		padding: 8px;
		position: relative;
	}
	
	.u-close {
		position: absolute;
		top: 32rpx;
		right: 32rpx;
	}
	
	.demo-image {
		width: 100%;
		border-radius: 4px;
	}
	
	.demo-title {
		font-size: 30rpx;
		margin-top: 5px;
		color: $u-main-color;
	}
	
	.demo-tag {
		display: flex;
		margin-top: 5px;
	}
	
	.demo-tag-owner {
		background-color: $u-type-error;
		color: #FFFFFF;
		display: flex;
		align-items: center;
		padding: 4rpx 14rpx;
		border-radius: 50rpx;
		font-size: 20rpx;
		line-height: 1;
	}
	
	.demo-tag-text {
		border: 1px solid $u-type-primary;
		color: $u-type-primary;
		margin-left: 10px;
		border-radius: 50rpx;
		line-height: 1;
		padding: 4rpx 14rpx;
		display: flex;
		align-items: center;
		border-radius: 50rpx;
		font-size: 20rpx;
	}
	
	.demo-price {
		font-size: 30rpx;
		color: $u-type-error;
		margin-top: 5px;
	}
	
	.demo-shop {
		font-size: 22rpx;
		color: $u-tips-color;
		margin-top: 5px;
	}
</style>